<template>
  <a-modal
    v-model="show"
    :centered="true"
    :keyboard="false"
    :footer="null"
    :width="1100"
    @cancel="handleCancleClick"
    title="入库信息">
    <a-layout class="user-info">
      <a-table ref="TableInfo"
               :columns="columns"
               :dataSource="budgetInfoData"
               :pagination="false"
               :loading="loading"
               :scroll="{ x: 900 }"
      >
      </a-table>
    </a-layout>
  </a-modal>
</template>
<script>
  import InputElement from 'ant-design-vue/es/auto-complete/InputElement'
  export default {
    name: 'BudgetInfo',
    components: {InputElement},
    props: {
      userInfoVisiable: {
        require: true,
        default: false
      },
      budgetInfoData: {
        require: true
      }
    },
    data () {
      return {
        dataSource: [],
        loading: false,
      }
    },

    mounted () {
      //this.loadtableData();
    },
    computed: {
      show: {
        get: function () {
          debugger;
          return this.userInfoVisiable
        },
        set: function () {
        }
      },
      columns () {
        let {sortedInfo, filteredInfo} = this
        sortedInfo = sortedInfo || {}
        filteredInfo = filteredInfo || {}
        return [{
          title: '序号',
          width: 80,
          customRender: function (text, record, index) {
            return index + 1
          }
        },{
          title: '材料编码',
          dataIndex: 'materialcode'
        }, {
          title: '材料名称',
          dataIndex: 'materialname'
        }, {
          title: '规格',
          dataIndex: 'spe'
        }, {
          title: '单位',
          dataIndex: 'unit'
        }, {
          title: '数量',
          dataIndex: 'mnumber'
        }, {
          title: '单价',
          dataIndex: 'price'
        }, {
          title: '金额',
          dataIndex: 'amount'
        },
          {
            title: '备注',
            dataIndex: 'remark'
          }
        ]
      }
    },
    methods: {
      loadtableData(){
        this.$get("materialindetail",{"annualBudgetId":"{{budgetInfoData.id}}"}).then((res)=>{
            this.dataSource=res.data;
        })
      },
      handleCancleClick () {
        this.$emit('close')
      }
    }
  }
</script>
<style lang="less" scoped>

</style>
